<template>
	<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="80px" label-position="top">
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="套餐名称" prop="name">
					<el-input v-model="form.name" clearable></el-input>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="类型" prop="type">
						<el-radio-group v-model="form.type">
							<el-radio v-model="form.type" label='1'>商家</el-radio>
							<el-radio v-model="form.type" label='2'>个人</el-radio>
						</el-radio-group>
				</el-form-item>
			</el-col>

		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="期限" prop="time_type">
					<el-radio-group v-model="form.time_type">
						<el-radio v-model="form.time_type" label='1'>永久</el-radio>
						<el-radio v-model="form.time_type" label='2'>自定义天数</el-radio>
					</el-radio-group>
				</el-form-item>
			</el-col>
			<el-col :span="12" v-if="form.time_type==2">
				<el-form-item label="期限天数" prop="time_days">
					<el-input v-model="form.time_days" clearable></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="24">
				<el-form-item label="套餐描述" prop="desc">
					<el-input type="textarea" v-model="form.desc"></el-input>
				</el-form-item>
			</el-col>

		</el-row>
	</el-form>
</template>

<script>
export default {
	props: {
		mode: { type: String, default: "add" }
	},
	data() {
		return {
			//表单数据
			form: {
				id:"",
				name: "",
				type:'1',
				time_type: '1',
				time_days:30,
				desc:''
			},

			//验证规则
			rules: {
				name:[
					{required: true, message: '请输入套餐名称'}
				],
				time_days: [
					{required: true, message: '请输入期限天数'}
				],
				desc: [
					{required: true, message: '请输入套餐描述'}
				]
			},
			//所需数据选项
			groups: [],
			groupsProps: {
				value: "id",
				multiple: true,
				checkStrictly: true
			}
		}
	},
	mounted() {
		if(this.mode != 'add'){
			this.rules.password = []
			this.rules.password2 = []
		}
		// this.getGroup()
	},
	methods: {

		//表单提交方法
		submit(callback){
			this.$refs.dialogForm.validate((valid) => {
				if (valid) {
					callback(this.form)
					console.log(this.form)
				}else{
					return false;
				}
			})
		},
		//表单注入数据
		setData(data){
			// this.form.id = data.id
			// this.form.userName = data.userName
			// this.form.avatar = data.avatar
			// this.form.name = data.name
			// this.form.group = data.group
			data.type = data.type==1?'1':'2'

			//可以和上面一样单个注入，也可以像下面一样直接合并进去
			Object.assign(this.form, data)
		}
	}
}
</script>

<style>
</style>
